import { Button, Form, Input, message } from 'antd';
import React from 'react';

import BaseDiv from '@/components/baseDiv';

import styles from './index.less';

const boxStyles: React.CSSProperties = {
  height: '651px',
  width: '100%',
  display: 'flex',
  justifyContent: 'space-evenly',
  alignItems: 'center',
  background: '#010c40',
};
const baseStyles: React.CSSProperties = {
  height: 651,
};
export default function AcquisitionScheme() {
  return (
    <BaseDiv baseStyles={baseStyles} boxStyles={boxStyles}>
      <div className={styles.left}>
        <div className={styles.title}>云安灯私有云企业内网部署</div>
        <div className={styles.des}>
          <span>数据私密更安全</span>
          <span>独享服务器更高效</span>
          <span>专属个性化定制更灵活</span>
          <span>专业技术支持服务更安心</span>
        </div>
      </div>
      <div className={styles.right}>
        <Form name="normal_login" className="login-form" initialValues={{ remember: true }}>
          <Form.Item name="phone" rules={[{ required: true, message: '填写您的手机号' }]}>
            <Input placeholder="填写您的手机号" />
          </Form.Item>
          <Form.Item name="name" rules={[{ required: true, message: '如何称呼您!' }]}>
            <Input placeholder="如何称呼您" />
          </Form.Item>
          <Form.Item name="serve" rules={[{ required: true, message: '填写服务企业名称' }]}>
            <Input placeholder="填写服务企业名称" />
          </Form.Item>
          <Form.Item name="userNumber" rules={[{ required: true, message: '所需用户数!' }]}>
            <Input placeholder="所需用户数" />
          </Form.Item>
          <Form.Item name="line" rules={[{ required: true, message: '所需产线数!' }]}>
            <Input placeholder="所需产线数" />
          </Form.Item>
          <Form.Item>
            <Button
              onClick={() => { message.info('暂无此功能');}}
              style={{
                width: '100%',
                background: '#1a3dc9',
                color: 'rgba(255, 255, 255, 0.85)',
                border: 'none',
              }}
              htmlType="submit"
            >
              提交获取专业价格方案
            </Button>
          </Form.Item>
        </Form>
        <div className={styles.connect}>我们将在1个工作日内与您取得联系</div>
      </div>
    </BaseDiv>
  );
}
